<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <div id='app'>
        <!-- <div v-text='text' @click='click'></div> -->
        <div id='text' v-on:click='click'>{{text}}{{message}}</div>
        <input type="text" @keyup='keyup' v-model='text'>
    </div>
    <script src='observe.js'></script>
    <script src='compile.js'></script>
    <script src='watcher.js'></script>
    <script src='mvvm.js'></script>
    <script src='fragement.js'></script>
    <script>
        var mvvm = new MVVM({
            el:"#app",
            data:{
                text:123,
                message:"🐷",
                mes:"312",
                eee:"eee"
            },
            created(){
                this.text = 'text';
                // this.message = '🐦';
                // this.eee = 'fff';
                // this.mes = 'mes';
                // console.log(this.text)
            },
            methods:{
               click(){
                //    console.log(1)
                    // console.log(this)
                   this.text = 2;
                //    console.log(2)
                //    console.log(this.text)
               },
               keyup(e){
                    // console.log(e.target.value)
                    // console.log(this.text)
               }
            }
        })
    </script>
</body>
</html>